<script>
export default {
  name:"",
  data(){
    return{
      fits:  'contain',

      // id:"",
      viewList:{
        viewId: "",
        cityId: "",
        viewName: "",
        viewPic: "",
        viewInfo: "",
        viewPic1: "",
        viewInfo1: "",
        viewAddr: "",
        viewPrice: "",
        viewMark: "",
        viewInfo2: ""
      }
    }
  },
  methods:{
    getInfo(){
      var  id = this.$route.params.viewId
      console.log(id)
      // console.log(this.$route.params.viewId)
      this.$axios.get('/view/viewId',
      {
        params: {
         viewId: id
        }
      }
      ).then(res=>{
        console.log(res.data.data)
        this.viewList = res.data.data
      })
    },
    submit(viewId){
      this.$router.push({name: "viewdingdan",params:{
          viewId:viewId
        }
      })
      console.log(viewId)
    }
  },
  mounted() {
    this.getInfo();
  }
}
</script>

<template>
  <div class="map-container">
  <div style="border: 2px solid black">
    <el-row >
      <el-col :span="9">
        <div class="demo-image">
          <div class="block">
            <el-image
              style="width: 550px; height: 400px"
              :src="viewList.viewPic"
              ></el-image>
          </div>
        </div>
      </el-col>
      <el-col :span="9">
        <h2>
          {{ viewList.viewInfo}}
        </h2>
        <p >
          <span style="font-weight: bold">用户点评：</span>
          <span style="font-size: 30px;color: red">{{ viewList.viewMark }}</span>
        </p>
        <p>
          <span style="font-weight: bold">出发地：</span>
          {{ viewList.viewAddr }}
        </p>

        <p>
          <h3>查看：《工商执照信息》 《特许经营许可证信息》</h3>

        </p>

        <p>
          <span style="font-weight: bold">推荐理由：</span>
          <br><br>
          <span> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ viewList.viewInfo2}}</span>

        </p>

      </el-col>
      <el-col :span="5" >
        <br><br><br><br><br><br>
        <span style="font-size: 20px;color: #f60;margin-left: 100px;">价格:</span>
        <span style="font-size: 30px;color: #f60;text-align: center;margin-top: 30px">
          {{ viewList.viewPrice }}￥</span>
        <br>
        <br>
        <el-button type="warning" style="width: 150px;height: 50px ;margin-left: 100px" @click="submit(viewList.viewId)">提交订单</el-button>
      </el-col>
    </el-row>
  </div>
  </div>
</template>

<style scoped>
.map-container{
  background-image: url('../assets/6.jpg');
  background-size: cover;
  background-position: center center;
  width: 1529px;
  height: 700px;
//opacity: 0.9;
}
</style>
